<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@include file="../mytags.jsp" %>
<t:base type="jquery"></t:base>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport"
          content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"/>
    <title>保修期查询</title>
    <script type="text/javascript" charset="utf-8">
        mui.init();
    </script>
    <script>
var _hmt = _hmt || [];
(function() {
  var hm = document.createElement("script");
  hm.src = "https://hm.baidu.com/hm.js?a2f6adcec5d52290d2cb3deea0aca05c";
  var s = document.getElementsByTagName("script")[0]; 
  s.parentNode.insertBefore(hm, s);
})();
</script>
    <style>
        h4 span{
            margin-right: 20px !important;
        }
    </style>
</head>
<body>
<div class="tel"><a href="tel:400-88-22726"> <img style="height: 40%;width: 100%;" src="${webRoot }images/${logo}"></a>
</div>
<div class="mui-content"
     style="background: none; margin-top: 10px; width: 100%;">
    <div style="padding: 10px 10px; background: #fff;">
        <div class="mui-content"
             style="width: 100%; background: #fff; padding: 15px; border-radius: 0;">
            <form id='login-form' class="mui-input-group" action="javascript:redirectQuery();">
                <div class="mui-input-row mui-input-row1"
                     style="height: 40px; padding-left: 5px;">
                    <input type="text" class="mui-input" placeholder="请输入设备序列号查询" value="${sn }" name="sn" id="sn"
                           style="width: 80%;">
                    <label style="float: right; width: 50px; text-align: left; padding-top: 8px;">
                        <a href="javascript:redirectQuery();">
                            <img src="${webRoot }images/sach.png" style="width: 25px;"></a>
                    </label>
                </div>
            </form>
        </div>
        <div class="mui-clearfix"></div>
    </div>
    <div id="item2" class="mui-control-content mui-active">
        <div class="mui-content" style="margin-top: 0px; width: 100%;">

            <div class="mui-content"
                 style="width: 100%; margin-top: 0px; border-radius: 0; background: none;">
                <div class="mui-card"
                     style="margin: 0; box-shadow: none; background: none;">
                    <ul class="mui-table-view hn">
                        <c:if test="${empty equip && !empty sn}">
                            <li style="height:40px;color:#a6aaab;text-align: center">无查询结果。</li>
                        </c:if>
                        <c:forEach items="${equip }" var="es">
                            <li>
                                <div class="mui-input-row mui-checkbox mui-left li_f mui-clearfix">
                                    <div class="inr" style="margin-left: 15px;">
                                        <div class="inrr" style=" margin: 0px 0px 5px 25px; width: 100%;">

                                            <h4>
                                                <span style="width: 100px;">序列号</span>${es.sn }&nbsp;
                                            </h4>
                                            <h4>
                                                <span style="width: 100px;">机型</span>${es.type.typeDesc}&nbsp;
                                            </h4>
                                            <h4>
                                                <span style="width: 100px;">保修状态</span>
                                                <c:choose>
                                                    <c:when test="${empty map[es.id] || map[es.id] < 0 }">
                                                        出保
                                                    </c:when>
                                                    <c:otherwise>在保</c:otherwise>
                                                </c:choose>
                                            </h4>
                                            <c:choose>
                                                <c:when test="${not empty map[es.id] && map[es.id] > 0 }">
                                                    <h4 style="color: #e70012;">
                                                        <span style="width: 100px;">距离出保时间</span>
                                                        <c:choose>
                                                            <c:when test="${empty map[es.id] || map[es.id] < 0 }">0</c:when>
                                                            <c:otherwise>${map[es.id] }</c:otherwise>
                                                        </c:choose>
                                                        天
                                                    </h4>
                                                </c:when>
                                            </c:choose>
                                        </div>
                                    </div>
                                </div>
                            </li>
                        </c:forEach>

                    </ul>
                </div>
            </div>
        </div>

    </div>
</div>
<div class="mui-clearfix"></div>
<div class="mui-content-padded" style="text-align: center;height:38px;margin-top: 10px;">
    <a class="mui-btn mui-btn-block mui-btn-primary" style="padding: 5px 0;width:40%;float:left;left:20px;" href="wxMenuController.do?sbwb">购买延保</a>
    <a class="mui-btn mui-btn-block mui-btn-primary" style="padding: 5px 0;width:40%;float:right;right:20px;" href="loginWxController.do?loginRedirect&type=1">购买增值产品</a>
</div>
<%-- 	<c:if test="${not empty 序列号 && not empty equip}"> --%>
<!-- 		<div class="mui-clearfix"></div> -->
<!-- 		<div class="mui-content-padded" id="xb"> -->
<!-- 			<a class="mui-btn mui-btn-block mui-btn-primary" -->
<!-- 				style="background: #cd0615;">立即续保</a> -->
<!-- 		</div> -->
<%-- 	</c:if> --%>
<!-- 	签到弹窗输入设备 -->
<div class="fot" style="position: absolute;bottom: 0px;line-height:20px;padding:5px 5px 5px 5px;">
    如需更多服务请拨打中影巴可24小时服务热线<br/><a href="tel:400-88-22726" style="color:blue">400-88-22726</a>咨询
</div>
<script type="text/javascript">
    $(document).ready(function () {
        $('#xb').click(function () {
            $('.mui-backdrop.ppp').toggle();
        })
        $('.close').click(function () {
            $('.mui-backdrop').toggle();
        })
    });
    function redirectQuery() {
        window.location.href = "zyEquipmentSpareController.do?wxRepairList&sn=" + $('#sn').val();
    }
</script>
</body>
</html>